{{! Sidebar game widgets }}
<div class="mt-4 relative flex flex-col mx-5">
    <div class="flex flex-row w-full space-x-2 space-y-0 mb-2">
        <div style="width: 40%" id="sbr_ele_status">
            <div class="widget w-full p-2.5 rounded-lg border border-base-200">
                <div class="flex flex-row items-center justify-between">
                    <div class="flex flex-col text-left">
                        <div class="text-xs uppercase text-base-content truncate">
                            Status
                        </div>
                        <div class="text-lg font-bold">
                            ...
                        </div>
                    </div>
                    <svg class="stroke-current text-info" height="24" width="24" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
                    </svg>
                </div>
            </div>
        </div>
        <div style="width: 60%">
            <button type="button" class="widget w-full p-2.5 rounded-lg border border-base-200 hover:bg-base-200 focus:outline-none" onclick="sbr_copy_url()">
                <div class="flex flex-row items-center justify-between">
                    <div class="flex flex-col text-left">
                        <div class="text-xs uppercase text-base-content truncate">
                            Game Code
                        </div>
                        <div class="text-lg font-bold" id="sidebar_game_code">
                            {{ slug_2 }}
                        </div>
                    </div>
                    <svg class="stroke-current text-secondary" height="24" width="24" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 15l-2 5L9 9l11 4-5 2zm0 0l5 5M7.188 2.239l.777 2.897M5.136 7.965l-2.898-.777M13.95 4.05l-2.122 2.122m-5.657 5.656l-2.12 2.122" />
                    </svg>
                </div>
            </button>
        </div>
    </div>
    <div class="flex flex-row w-full space-x-2 space-y-0 mb-2">
        <div style="width: 60%">
            <div class="widget w-full p-2.5 rounded-lg border border-base-200">
                <div class="flex flex-row items-center justify-between">
                    <div class="flex flex-col">
                        <div class="text-xs uppercase text-base-content truncate">
                            Exploding Chickens
                        </div>
                        <div class="text-lg font-bold truncate" id="sbr_ele_ec_count">
                            ...
                        </div>
                    </div>
                    <svg class="stroke-current text-error" height="24" width="24" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z" />
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z" />
                    </svg>
                </div>
            </div>
        </div>
        <div style="width: 40%">
            <div class="widget w-full p-2.5 rounded-lg border border-base-200">
                <div class="flex flex-row items-center justify-between">
                    <div class="flex flex-col">
                        <div class="text-xs uppercase text-base-content truncate">
                            Cards Left
                        </div>
                        <div class="text-lg font-bold truncate" id="sbr_ele_cards_remain">
                            ...
                        </div>
                    </div>
                    <svg class="stroke-current text-success" height="24" width="24" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
                    </svg>
                </div>
            </div>
        </div>
    </div>
</div>